$(function(){
   //同步显示图片
   $('.smallImg ul li img').mouseover(function(){
       var midpath = $(this).attr('midimg');
       var bigpath = $(this).attr('bigimg');
       $('.bigimg img').attr("src",midpath);
       $('.danpinBigImg img').attr("src",bigpath);
   }) 
   
   //利用规格获取数据
   $('.selSize ul li a').click(function(){
       //给本元素添加calss"red",其他的同辈元素去掉class"red";
       $(this).addClass('red').siblings().removeClass('red');
       //查询class的长度
       var len = $('.selSize ul li .red').length;
       //查询规格的循环长度
       var lilen = $('.selSizeArea').length;
       //
       if(len>=lilen){
           var id='';
           var gid = 0;
           var val = '';
           //将规格中的商城售价转整并赋值给变量
           var price = parseInt($(this).attr('shop_price'));
           $.each($('.red'),function(){
               //获取页面商品信息属性id
               id += $(this).attr('specId') + ','; 
               //获取页面商品信息商品id；
               gid = $(this).attr('gid');
               //获取页面商品信息属性值；
               val += $(this).attr('ganame') + ',';
               //将规格中的附加价格转整并加到变量中；
               price +=parseInt($(this).attr('add_price'));
               //将商品规格信息下的所有元素清除；
               $('.goodsAdd *').remove();
               //在商品规格信息div下面追加属性值及是否有货的标签；
               $('.goodsAdd').append('<p>' + val + '</p><p id="fqty-msg" taid=' + id + ' isshop="" style="color:red"></p>');
               //将最终售价填入到售卖价格中
               $('.cuxiaoprice span strong').html(price);
               //规格属性变动时,将购买数子回到1
               $('#selectedAmount').val('1');
           })
            $.ajax({
            type:"post",
            url:attrGetData,
            data:{id:id,gid:gid},
            //服务器返回的数据类型
            dataType:'json',
            success:function(phpData){
               if(phpData=='0'){
                   $('#fqty-msg').html('暂时无货'); 
                   $('#fqty-msg').attr('isshop',"2");
               }else{
                   $('#fqty-msg').html('现在有货'); 
                   $('#fqty-msg').attr('isshop',"1");
               }
            }
           });
       }  
   })
   
    //选择库存时异步获取库存
    $('#selectedAmount').change(function(){
        //判断用户有没有选择规格
        var isFqty = $('#fqty-msg').attr('isshop');
        //选择了规格,并且有货品
        if(isFqty==1){
            var id='';
            var gid = 0;
            //获取购买数
            var buyFqty = $(this).val();
            //循环规格属性
            $.each($('.red'),function(){
               //获取页面商品信息属性id
               id += $(this).attr('specId') + ','; 
               //获取页面商品信息商品id；
               gid = $(this).attr('gid');
            })
            $.ajax({
            type:"post",
            url:attrGetData,
            data:{id:id,gid:gid},
            //服务器返回的数据类型
            dataType:'json',
                success:function(phpData){
                   if(buyFqty > phpData){
                       alert('亲,现在只有' + phpData + '支库存,请您重新选择购买数');
                   }
                }
            });
       }else if(isFqty==2){//选择了规格,但该规格一支货品也没有了.
           alert('亲,当前货品没有库存了.');
           $('#fqty-msg').attr('isshop',"2");
       }else{//用户没有选择规格
           alert('亲,请先选择规格.');
           $('#fqty-msg').attr('isshop',"1");
       }  
    })
    
    //点击购物车关闭按钮
    $('#carbox .close').click(function(){
        $('#carbox').hide();    
    })
    
    //加入购物车
    $('#toAddShoppingCar').live('click',(function(){
        //判断用户选择的商品有没有库存
        var isFqty = $('#fqty-msg').attr('isshop');  
        if(isFqty==2){
            alert('亲,当前货品没有库存了.');
            return false;
        }else if(isFqty==1){
            var id='';
            var gid = 0;
            var val = '';
            //将客户选择的购买数量赋予变量
            var fqty = $('#selectedAmount').val();
            //将规格中的gid转整并赋值给变量
            gid = parseInt($('.selSize ul li a').attr('gid'));
            //将客户选择的属性id
            id = $('#fqty-msg').attr('taid');
            $.ajax({
                type:"post",
                url:ShopCarAdd,
                data:{id:id,gid:gid,fqty:fqty},
            });     
            $('#carbox').css('display','block');  
        }else{
            alert('亲,请选择规格及购买数量.');
            return false;
        }
    }))
    
    //放大镜开始:.cover代表中图
    //内容页放大镜效果 box中图鼠标移入显示的色块，cover盖子
    //获取小色块的宽高
    var boxWH = $('.box').width();
    //获取盖子的宽高
    var bigWH = $('.bigimg').width();
    
    // 给左侧加鼠标移动事件，给代替事件源的盖子加
    $('.cover').mousemove(function(e){
//      alert(1);
        // 获得鼠标距离事件源(400*400)左侧和顶部距离X左IEoffsetX
        var offset = $(this).offset();
        var relativeX = (e.pageX - offset.left);
//      alert(relativeX);
        var relativeY = (e.pageY - offset.top);
        // 在title标题栏里显示鼠标距离事件源左边 和上面的具体数值
//      document.title = relativeX;
        // 计算小色块的位置,小色块是200*200,用图片的宽度-色块的宽度/2
        var box_left=relativeX-boxWH/2;
        var box_top=relativeY-boxWH/2;
        
        //小色块的左侧边距距离左侧为0时，让小色块的left值为0
        if(box_left<0){
            box_left=0;
        }
        //小色块右侧的边距大于盖子的宽的时候，小色块的left值为200
        if(box_left>bigWH - boxWH){
            box_left=bigWH - boxWH;
        }
        //小色块的上边距离为0时，让小色块的top值为0
        if(box_top<0){
            box_top=0;
        }
        //小色块底部大于盖子高的时候，让小色块的top值为200
        if(box_top>bigWH - boxWH){
            box_top=bigWH - boxWH;
        }
        // 将色块的位置赋值
        $('.box').css({'left':box_left});
//      alert(box_left);
        $('.box').css({'top':box_top});
//
        // 计算右侧大图的位置
        var pic_left=box_left*-2;
        var pic_top=box_top*-2;
//         alert(pic_left);
        
//      // 将大图的位置赋值回去
        $('.danpinBigImg').css({'left':pic_left})+'px';
//      alert(bigPic);
        $('.danpinBigImg').css({'top':pic_top})+'px';
    })
     // 给盖子加移入事件
    $('.cover').mouseenter(function(){
//      alert(1);
        // 让色块显示
        $(this).siblings('.box').css({'display':'block'});
        // 让右侧显示
         $('.danpinBig').css({'display':'block'});
    })
//
     // 给盖子加移出事件
     $('.cover').mouseleave(function(){
        // 让色块隐藏
         $(this).siblings('.box').css({'display':'none'});
        // 让右侧隐藏
        $('.danpinBig').css({'display':'none'});

    })
    //内容页放大镜效果结束
})